<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
            xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <ui:composition template="template/layout.xhtml">
        <ui:define name="title">Projet 1 : Acceuil</ui:define>
        <ui:define name="navigation">
            <ul>
                <ui:repeat var="cat" value="#{produitManagedBean.liste}" varStatus="status">
                    <li>
                        <h:outputLink value="categorie.xhtml?id=#{cat.id}">#{cat.nom}</h:outputLink>
                        <ul>
                            <ui:repeat var="souscat" value="#{cat.sousCategories}" varStatus="status2">
                                <li><h:outputLink value="souscategorie.xhtml?id=#{souscat.id}">#{souscat.nom}</h:outputLink></li>
                            </ui:repeat>
                        </ul>
                    </li>
                </ui:repeat>
            </ul>            
        </ui:define>
        
          <ui:define name="content" >
               
           <h:form id="listVignetteForm">
               <p:growl id="msg" />
               <p:dataGrid var="vignetteProduit" value="#{mbSousCategorie.listVignette}" columns="2"  
                        rows="12" paginator="true"  
                        paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                        rowsPerPageTemplate="9,12,15">  
                
                               
                <p:column>
                    
                <div style="float:left;">  
                    <h:graphicImage alt="imageVignette" value="#{vignetteProduit.vignette}" style="margin-left: 5px; margin-right: 5px; margin-top: 5px;"/>
                </div>
                <div>
                    <h:outputLabel value="#{vignetteProduit.nom}" style="display: block; text-align: center; font-size:20pt;"></h:outputLabel><br/>
                    <h:outputLabel  value="#{vignetteProduit.prix}€"  style="display: block; text-align: center; font-size:20pt;"/>
                    <h:outputLabel value="#{vignetteProduit.remisePromo}% de remise" rendered="#{vignetteProduit.remisePromo > 0}" style="display: block; text-align: center; font-size:20pt;"/>
                    <h:outputLabel  value="#{vignetteProduit.resume}" style="padding: 5px;"/>
                    <h:outputLabel value="Attention! Moins de 10 produits en stock!" style="color: red" rendered="#{vignetteProduit.stock lt 10}"/>
                </div>
            <div>  
                <p:commandButton value="Ajouter au panier" action="#{mbPanier.ajouterProduit(vignetteProduit.id)}" update="@form"/>
                  <p:commandButton value="Voir descriptif complet" action="#{mbSousCategorie.voirFicheProduit(vignetteProduit.id)}"/>
             </div>  
                 
            </p:column>
                    
            </p:dataGrid>
           </h:form>        
        </ui:define>
    </ui:composition>
</html>

